<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core"  prefix="c"%>
<!DOCTYPE html>
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>主页</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	
	<link rel="stylesheet" type="text/css"	href="${pageContext.request.contextPath}/js/easyui/demo.css">
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/js/easyui/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/js/easyui/themes/icon.css">
	<script type="text/javascript"	src="${pageContext.request.contextPath}/js/jquery-1.11.0.min.js"></script>
	<script type="text/javascript" src="${pageContext.request.contextPath}/js/easyui/jquery.easyui.min.js"></script>
 	<script type="text/javascript">
 	 var tabOnSelect = function(title) {
 		//根据标题获取tab对象
 		var currTab = $('#tabs').tabs('getTab', title);
 		var iframe = $(currTab.panel('options').content);//获取标签的内容
 		var src = iframe.attr('src');//获取iframe的src
 		//当重新选中tab时将ifram的内容重新加载一遍，目的是获取当前页面的最新内容
 		if (src)
 			$('#tabs').tabs('update', {
 				tab : currTab,
 				options : {
 					content : createFrame(src)//ifram内容
 				}
 			});
 	};
 	var _menus;
 	$(function() {//预加载方法
 		$('#tabs').tabs('add', {
 			title : '欢迎使用',
 			content : 'welcome'
 		}).tabs({
 			//当重新选中tab时将ifram的内容重新加载一遍
 			onSelect : tabOnSelect
 		});
 	});

 	//退出系统方法
 	function logout() {
 			location.href = '${pageContext.request.contextPath}/logout.do';
 	}

 	/**
 	 * 
 	 * @param subtitle 标题
 	 * @param url 访问地址
 	 * @param icon 图标
 	 */
 	function addTab(subtitle,url,icon){
 		//如果指定标题的tab不存则添加一个新的
 		if(!$('#tabs').tabs('exists',subtitle)){
 			$('#tabs').tabs('add',{
 				title:subtitle,
 				content:createFrame(url),
 				closable:true,
 				icon:icon
 			});
 		}else{
 			//如果tabs已创建则选中
 			$('#tabs').tabs('select',subtitle);
 		}
 	}

 	function createFrame(url){
 		var s = '<iframe scrolling="auto" frameborder="0"  src="'+url+'" style="width:100%;height:100%;"></iframe>';
 		return s;
 	}
 	</script>
 
 
  </head>
  
 	<body class="easyui-layout">
		<div data-options="region:'north',border:false" style="height:60px;background:#B3DFDA;padding:10px">
			欢迎当前用户：${activeUser.username}
			<a id="loginOut" href="javascript:logout()">退出系统</a>
		</div>
		<div data-options="region:'west',split:true,title:'West'" style="width:150px;padding:10px;">
			<c:if test="${activeUser.menus!=null }">
				<ul>
				<c:forEach items="${activeUser.menus }" var="menu">
					<li><div>
						<a title="${menu.name }" ref="1_1" href="#"
							rel="${pageContext.request.contextPath}/${menu.url }" icon="icon-log"><span
							class="icon icon-log">&nbsp;</span><span class="nav"><a href=javascript:addTab('${menu.name }','${pageContext.request.contextPath}/${menu.url }')>${menu.name }</a></span></a>
					</div></li>
				</c:forEach>
				</ul>
			</c:if>
		</div>
		<div data-options="region:'east',split:true,collapsed:true,title:'East'" style="width:100px;padding:10px;">east region</div>
		<div data-options="region:'south',border:false" style="height:50px;background:#A9FACD;padding:10px;"></div>
		<div data-options="region:'center',title:'Center'">
			<div id="tabs" class="easyui-tabs" border="false" fit="true"></div>
		</div>
	</body>
</html>
